body,html{
    width: 100%;
    height: 100%;
    background-color: #F3F3F3;
}
    .headtop{
        height: 162px;
        width: 100%;
       
        .head1{
            width: 100%;
            height: 30px;
            background-color: #d5d5d5;
            .w{            
              .didian{
                width: 50px;
                line-height: 30px;
                span{
                    float: left;
                }
               }
               .zhuce{
                width: 731px;
                height: 30px;
                  .line{
                    width: 1px;
                    height: 12px;
                    background-color: rgb(80, 77, 77);
                    margin-top: 8px;
                  }
                  li{
                    
                    float: left;
                    line-height: 30px;
                    margin-right: 10px;
                    &:last-child{
                        margin-right: 0;
                    }
                  }
                  li{
                    position: relative;
                    
                    .listbox{
                      display: none;
                      position: absolute;
                      top:30px;
                      left:0;
                      width: 200px;
                      height: 100px;
                      background-color: #d21313;
                      z-index: 1;
                    }
                  }
                 .down_list:hover .listbox {
                    display: block;
                 }
                  .down::after{
                    content: "";
                    display: block;
                    width: 0;
                    height: 0;
                    border-top: 5px solid rgb(74, 72, 72);
                    border-left: 5px solid transparent;
                    border-right: 5px solid transparent;
                    border-bottom: 5px solid transparent;
                    float: left;
                    margin-top: 10px;
                    
                  }
               }
            }
            
        }
       .head2{
        height: 133px;
        background-color: white;
         .searchbox{
            width: 690px;
            height: 132px;
            .searchtop{
                width: 100%;
                margin-top: 12px;
                height: 36px;
                .search{
                    position: relative;
                    width: 590px;
                    height: 100%;
                    float: left;
                  input[type=text]{
                    padding-left: 7px;
                    width: 511px;
                    height: 100%;
                    border: 3px red solid;
                    float: left;
                    box-sizing: border-box;
                    &:hover{
                        border: 2px solid blue;
                    }
                  }
                  input[type=button]{
                    width: 79px;
                    height: 36px;
                    background-color: red;
                    float: left;
                  }
                  .icon-search{
                    position: absolute;
                    right: 30px;
                    bottom: 9px;
                    font-size: 20px;
                  }
                }
                .car{
                    width:92px ;
                    height: 36px;
                    border: 1px solid red;
                    line-height: 36px;
                    color: red;
                    font-weight: 600;
                    font-size: 12px;
    
                    .icon-gouwuche{
                        margin-left: 3px;
                    }
                }
            }
            .middle{
                width: 452px;
                height: 18px;
                margin-top: 15px;
                li{
                    line-height:18px ;
                    font-size: 10px;
                    color: red;
                    float: left;
                    margin-right: 10px;
                }
            }
            .nav{
                width:100%;
                height: 22px;
                margin-top: 15px;
                li{
                    font-weight: 600;
                    float: left;
                    margin-right: 5px;
                }
            }
        }
       }
    }
    .main_body{
      width: 100%;
      height: 458px;
      .w{
          height: 458px;

          .left_list{
            position: relative;
            width: 190px;
            height: 458px;
            background-color: #fff;
            ul{
              padding-top: 10px;
            }
            li{
              height: 28px;
              line-height: 28px;
              padding-left: 15px;
              &:hover{
                background-color: orange;
                color: #fff;
                .listbox2{
                  display: block;
                }
              }
              .listbox2{
                position: absolute;
                width: 600px;
                min-height: 458px;
                background-color: #fff;
                border: 1px solid red;
                left: 190px;
                top: 0;
                display: none;
                
              }
            }
          }
          .banner{
            width: 590px;
            height: 458px;
            margin: 0 10px;
          }
          .right_ad{
            width: 190px;
            height: 458px;
            a:nth-child(2){
              margin: 10px 0;
              display: block;
            }
          }
          .right_member{
            width: 190px;
            height: 458px;
            background-color: #fff;
            padding: 10px 20px;
            box-sizing: border-box;
            .user{
              width: 150px;
              height: 84px;
              border-bottom: 1px solid #CCCCCC;
              .top_user{
                .wenzi{
                  margin-left: 8px;
                  font-size: 12px;
                }
              }
              .bot_user{
                margin-top: 16px;
                font-size: 13px;
                span{
                  background-color: red;
                  color: #fff;
                  border-radius: 69px;
                  &:last-child{
                    background-color: #363634;
                    color: #BEB482;
                    margin-left: 10px;
                  }
                }
                  

              }
              
            }
            .YMnews{
              height: 170px;
            .title_YM{
              a{
                margin-left: 40px;
              }
            }
            .YM_list{
              li{
                margin-top: 10px;
              }
              span{
                background-color: pink;
                color: red;
                float: left;
              }
              a{
                width: 120px;
                height: 22px;
                line-height: 22px;
                display: inline-block;
                word-break: keep-all;
                text-overflow: ellipsis;
                overflow: hidden;
                float: left;
              }
            }
           }
            .severlist{
              height: 174px;
              width: 170px;
              li{
                width: 36px;
                height: 46px;
    
                float: left;
                margin-right: 4px;
                margin-bottom: 10px;
                text-align: center;

                .box{
                   width: 28px;
                   height: 28px;
                   margin-left: 8px;
                   margin-top: 2px;
                   background-image: url(../image/侧边栏图标_默认@1x.png) ;
                   background-position: -43px -2px;
                 
                  
                  
                }
                
              }
            }
          }
      }
      
    }
    .nianhuo{
      width: 1270px;
      height: 555px;
      margin: 20px auto;
      background-image: url(../image/年货推荐_背景@1x.png);
      overflow: hidden;
      ul{
        margin-top: 120px;
        margin-left: 60px;
      }
      li{
        
        width:178px;
        height:198px;
        float: left;
        background: url(../image/年货产品背景框框@1x.png) no-repeat;
        text-align: center;
        margin-bottom: 10px;
        margin-right: 10px;
        .lixi{
          
          width: 190px;
          height: 32px;
          background: url(../image/年货产品_免息横幅@1x.png) no-repeat;
          color: white;
          line-height: 32px;
          
        }
        p{
          color: #d21313;
          font-weight: 500;
          margin-top: 10px;
        }
       
      }
    }
    .cheap{
      height: 318px;
      .tejia{
        height: 318px;
        width: 590px;
        background-color: #fff;
        .title_tejia{
          width: 570px;
          height: 34px;
          margin: 10px 10px;
          h1{
            font-size: 25px;
            float: left;
            color: black;
          }
          a{
            display: inline-block;
            float: left;
            margin-left: 20px;
            text-align: center;
          }
          span{
            float: right;
            margin-bottom: 0;
          }
        }
        .bottom_tejia{
          width: 580px;
          height: 254px;
          .left_tu{
            width: 180px;
            margin-left: 10px;
            background-color:#F8F8F8;
            img{
              margin-bottom: 10px;
            }
            .box{
              width:110px ;
              height: 110px;
              background: url(../image/每日特价产品图01@1x.png) no-repeat;
              margin: 0 auto;
            }
            p{
              text-align: center;
              margin-top: 15px;
              color: black;
              &:nth-child(3){
                font-weight: 600;
            }
              &:nth-child(4){
                  color:red;
              }
              &:nth-child(5){
                color:#CCCCCC;
                font-size: 10px;
                margin-bottom: 8px;
            }

            }
           
          }
          .right_tu{
            width: 390px;
            height: 254px;
           
            .box{
              width: 190px;
              height: 90px;
              float: left;
              margin-top: 10px;
              &：
             
              p{
                width: 90px;
              }
            }
          }
        }
      }
    }
    .foot{
      background-color: #483E3E;
      padding-bottom: 30px;
      .foot2{
        height: 252px;
        border-bottom: 1px solid #584D4D;
        ;
        dl{
          float: left;
          width: 190px;
          height: 200px;
        }
        dt{
          font-size: 20px;
          color: #fff;
        }
        dd{
          color: #fff;
          margin-top: 8px;
        }
      }
      .foot3{
        margin-top: 30px;
        text-align: center;
        ul{
          display: inline-block;
        }
        li{
          float: left;
          margin-right: 20px;
          a{
            color: #fff;
          }
        }
        p{
          color: #fff;
        }
      }
    }



